<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>百度完整版</title>
    <link rel="stylesheet" type="text/css" href="./baidufinish.css"/>
    <link class="css" rel="stylesheet" type="text/css" href="./default.css"/>
    <!--[if IE]>
    <script src="html5shiv.js"></script>
    <![endif]-->
</head>

<body>
<div id="container">
    <!-- header是头部 -->
    <header>
        <!-- nav包含了头部的所有a标签 -->
        <nav>
            <div class="navleft">
                <!-- 天气预报-->
                <div class="prediction ">
                    <a class="get_data pre" href="javascript:;">
                        <div class="city">北京：</div>
                        <div>
                            <img class="now-icon" src="b/a3.png"/>
                        </div>
                        <div class="temp">4℃</div>
                        <div class="wind">微风</div>
                        <div class="air">28</div>
                    </a>

                    <div class="prediction-box pre">
                        <div class="timer">
                            <div class="triangle1"></div>
                            <div class="triangle2"></div>
                            <a class="date1" title="01月21日">01月21日</a>&nbsp;
                            <a class="date2" title="农历十二月十二">农历十二月十二</a>　
                            <a class="sevdays" href="http://www.weather.com.cn/weather/101020100.shtml#7d">未来七天天气</a>
                            <a class="weather-set" href="javascript:;"><span></span>设置</a>
                        </div>
                        <div class="fivedays">
                            <ul>
                                <li class="firday">
                                    <a href="#">
                                        <p class="dat" title="今天（星期四）">今天(星期四)</p>
                                        <img class="pic" src="b/a6big.jpg"/>

                                        <p class="tem" title="3℃">3℃</p>

                                        <p class="wea" title="雨夹雪转小雨">雨夹雪转小雨</p>

                                        <p class="win" title="东北风微风">东北风微风</p>
                                    </a>
                                </li>
                                <li class="secday">
                                    <a href="#">
                                        <p class="dat" title="明天(周五)">明天(星期五)</p>
                                        <img class="pic" src="b/a7big.jpg"/>

                                        <p class="tem" title="5 ~ 1℃">5 ~ 1℃</p>

                                        <p class="wea" title="小雨转雨夹雪">小雨转雨夹雪</p>

                                        <p class="win" title="东北风3-4级">东北风3-4级</p>
                                    </a>
                                </li>
                                <li class="thrday">
                                    <a href="#">
                                        <p class="dat" title="后天(周六)">后天(周六)</p>
                                        <img class="pic" src="b/a2big.jpg"/>

                                        <p class="tem" title="1 ~ -6℃">1 ~ -6℃</p>

                                        <p class="wea" title="阴转多云">阴转多云</p>

                                        <p class="win" title="北风3-4级">北风3-4级</p>
                                    </a>
                                </li>
                                <li class="forday">
                                    <a href="#">
                                        <p class="dat" title="周日">周日</p>
                                        <img class="pic" src="b/a0big.jpg"/>

                                        <p class="tem" title="-4 ~ -7℃">-4 ~ -7℃</p>

                                        <p class="wea" title="晴">晴</p>

                                        <p class="win" title="西北风3-4级">西北风3-4级</p>
                                    </a>
                                </li>
                                <li class="fifday">
                                    <a href="#">
                                        <p class="dat" title="周一">周一</p>
                                        <img class="pic" src="b/a0big.jpg"/>

                                        <p class="tem" title="1 ~ -4℃">1 ~ -4℃</p>

                                        <p class="wea" title="晴转多云">晴转多云</p>

                                        <p class="win" title="北风3-4级">北风3-4级</p>
                                    </a>
                                </li>

                            </ul>
                        </div>
                    </div>
                </div>
                <!-- 天气预报右侧部分-->
                <div class="title">
                    <div class="titlebtn">
                        <span>|&nbsp;</span>
                        <a href="#" title="宝箱"> 宝箱</a>
                        <a href="javascript:;" title="换肤" class="skin-peeler">换肤</a>
                        <a href="javascript:;" title="消息" class="tidings">消息</a>
                    </div>
                    <div class="skin">
                        <div class="stylename">
                            <ul>
                                <li>风景</li>
                                <li>简约</li>
                                <li>小清新</li>
                            </ul>
                            <p class="default">默认</p>

                            <div class="retract"><span></span>收起</div>
                        </div>
                        <div class="bagimg">
                            <div class="fourimg1 skinshow">
                                <ul>
                                    <li>
                                        <img src="b/54.jpg" height="123px" data="bg"/>
                                    </li>
                                    <li>
                                        <img src="b/37.jpg" height="60px"/>

                                        <div>
                                            <img src="b/115.jpg" height="60px" data="bg"/>
                                        </div>
                                    </li>
                                    <li>
                                        <img src="b/120.jpg" height="123px" data="bg"/>
                                    </li>
                                </ul>
                            </div>
                            <div class="fourimg2">
                                <ul>
                                    <li>
                                        <img src="b/114.jpg" height="123px" data="bg"/>
                                    </li>
                                    <li>
                                        <img src="b/21.jpg" height="60px" data="bg"/>

                                        <div>
                                            <img src="b/14.jpg" height="60px" data="bg"/>
                                        </div>
                                    </li>
                                    <li>
                                        <img src="b/111.jpg" height="123px" data="bg"/>
                                    </li>
                                </ul>
                            </div>
                            <div class="fourimg3">
                                <ul>
                                    <li>
                                        <img src="b/65.jpg" height="123px" data="bg"/>
                                    </li>
                                    <li>
                                        <img src="b/113.jpg" height="60px" data="bg"/>

                                        <div>
                                            <img src="b/39.jpg" height="60px" data="bg"/>
                                        </div>
                                    </li>
                                    <li>
                                        <img src="b/124.jpg" height="123px" data="bg"/>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="infobox">
                        <span></span>
                        <i></i>

                        <p>您目前没有新消息!</p>
                    </div>
                </div>
            </div>
            <!-- 头部右侧导航-->
            <div class="navright">
                <a href="#" target="_blank" class="bold">糯米</a>
                <a href="#" target="_blank" class="bold">新闻</a>
                <a href="#" target="_blank" class="bold">hao123</a>
                <a href="#" target="_blank" class="bold">地图</a>
                <a href="#" target="_blank" class="bold">视频</a>
                <a href="#" target="_blank" class="bold">贴吧</a>
                <a href="#" class="no-bold">登录</a>
                <a href="javascript:;" class="set no-bold">设置</a>
                <a href="javascript:;" id="more">更多产品</a>
            </div>
        </nav>
        <div id="set-dropdown">
            <div class="dropdown1 set">
                <div class="icon1"></div>
                <div class="icon2"></div>
                <a href="javascript:;">搜索设置</a>
                <a href="//www.baidu.com/gaoji/advanced.html" target="_blank">高级搜索</a>
                <a href="javascript:;">关闭预测</a>
                <a href="javascript:;">搜索历史</a>
            </div>
            <div class="dropdown2">
                <div id="moreproducts">更多产品</div>
                <div id="morea">
                    <a href="#" class="music"><span id="musicbg"></span>音乐</a>
                    <a href="#"><span id="imgbg"></span>图片</a>
                    <a href="#"><span id="knowbg"></span>知道</a>
                    <a href="#"><span id="librarybg"></span>文库</a>
                    <a href="#"><span id="topbg"></span>风云榜</a>
                    <a href="#"><span id="baidubg"></span>百度推广</a>
                    <a href="javascript:;" id="totalproducts">全部产品&gt;&gt;</a>
                </div>
            </div>
        </div>
        <!-- 顶部固定的搜索框-->
        <div class="topsearch">
            <div class="topbox">
                <a href="#" class="top-logo"><img src="b/logo_top.png" width="101px"></a>

                <form action="https://www.baidu.com/s" method="get" class="topform" target="_blank">
                    <input type="search" class="input" name="wd">
                    <input type="submit" value="百度一下" class="button">
                </form>
            </div>
        </div>
    </header>
    <!-- 主体 -->
    <article>
        <div class="art-top">
            <img src="b/bd_logo1.png" width="270px" height="129px">
        </div>
        <div id="middle1">
            <form action="#" method="get" target="_blank">
                <input type="search" class="input" name="wd"/>
                <input type="submit" value="百度一下" class="button"/>
            </form>
        </div>
        <div class="main">
            <div class="caption">
                <div class="follow grey " id="follow"><span class="blackimg"></span>我的关注</div>
                <div id="groom">推荐</div>
                <div id="video">视频</div>
                <div id="shopping">购物</div>
                <a href="javascript:;"></a>
            </div>
            <div class="text-list">
                <ul class="listinner">
                    <li class="navbartext showyou">
                        <div class="likelist">
                            <h3>猜你喜欢</h3>
                            <ul class="website-list">
                                <li class="orange">
                                    <a href="#" title="百度糯米">
                                        <img src="b/9483.png"/> 百度糯米
                                    </a>

                                    <div class="rebate">最高返利3.54%</div>
                                </li>
                                <li class="orange">
                                    <a href="#" title="京东商城">
                                        <img src="b/95541.png"/>京东商城
                                    </a>

                                    <div class="rebate">最高返利80.00%</div>
                                </li>
                                <li class="orange">
                                    <a href="#"
                                       title="1号店">
                                        <img src="b/95780.png"/>1号店
                                    </a>

                                    <div class="rebate">最高返利75.60%</div>
                                </li>
                                <li class="orange">
                                    <a href="#" title="苏宁易购">
                                        <img src="b/95537.png"/>苏宁易购
                                    </a>

                                    <div class="rebate">最高返利80.00%</div>
                                </li>
                                <li class="orange">
                                    <a href="#" title="唯品会">
                                        <img src="b/95693.png"/> 唯品会
                                    </a>

                                    <div class="rebate">最高返利7.00%</div>
                                </li>
                                <li class="orange">
                                    <a href="#" title="当当网">
                                        <img src="b/95517.png" alt=""/>当当网
                                    </a>

                                    <div class="rebate">最高返利75.00%</div>
                                </li>
                                <li>
                                    <a href="#" title="极客学院"> <img src="b/200974.png" />极客学院</a>
                                </li>
                                <li>
                                    <a href="#" title="scrolltop"><img
                                            src="b/6000.png" alt=""/>scrolltop</a>
                                </li>
                                <li>
                                    <a href="#" title="jqueryget"><img
                                            src="b/6000.png" alt=""/>jqueryget</a>
                                </li>
                                <li>
                                    <a href="#" title="javascript教程"><img src="b/6000.png"
                                                                                                       alt=""/>javascript教程</a>
                                </li>
                                <li>
                                    <a href="#" title="花瓣网"><img src="b/95742.png" alt=""/>花瓣网</a>
                                </li>
                                <li>
                                    <a href="#" title="jquery"><img
                                            src="b/82906.png" alt=""/> jquery</a>
                                </li>
                                <li>
                                    <a href="#" title="淘宝网"><img src="b/95487.png" alt=""/>淘宝网</a>
                                </li>
                                <li>
                                    <a href="#" title="微信"><img src="b/95753.png" alt=""/>微信</a>
                                </li>
                                <li>
                                    <a href="#" title="斗鱼"><img src="b/200001.png" alt=""/>斗鱼</a>
                                </li>
                                <li>
                                    <a href="#" title="腾讯"><img src="b/95511.png" alt=""/>腾讯</a>
                                </li>
                                <li>
                                    <a href="#" title="爱奇艺"><img src="b/95502.png" alt=""/> 爱奇艺</a>
                                </li>
                                <li>
                                    <a href="#" title="铁路客户服务中心"><img src="b/81407.png" alt=""/>铁路客户服务中心</a>
                                </li>
                                <li>
                                    <a href="#" title="优酷网"><img src="b/95489.png" alt=""/>优酷网</a>
                                </li>
                                <li>
                                    <a href="#" title="网易"><img src="b/95504.png" alt=""/>网易</a>
                                </li>
                                <li>
                                    <a href="#" title="58同城"><img src="b/95510.png" alt=""/>
                                        58同城</a>
                                </li>
                                <li>
                                    <a href="#" title="新浪微博"><img src="b/95488.png" alt=""/>新浪微博</a>
                                </li>
                                <li>
                                    <a href="#" title="百度VIP"><img
                                            src="b/7656.png" alt=""/>百度VIP</a>
                                </li>
                                <li>
                                    <a href="#" title="微软商店"><img src="b/9321.png" alt=""/>微软商店</a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li class="recommendtext">
                        <div class="content">
                            <div class="recommendlist">
                                <div class="info">
                                    <div class="linerl"></div>
                                    <div class="intr">以下信息根据您的兴趣推荐</div>
                                    <div class="linerg"></div>
                                </div>
                                <ul class="recommendlt">
                                    <li class="firli">
                                        <dl>
                                            <dt>
                                                <a href="#" title="香港收视报告：《无心法师》表现普通">
                                                    香港收视报告：《无心法师》表现普通</a>
                                            </dt>
                                            <dd>新浪娱乐　01-09 17:52</dd>
                                        </dl>
                                        <div class="imgwrap">
                                            <img src="b/80.jpg" alt="香港收视报告：《无心法师》表现普通" title="香港收视报告：《无心法师》表现普通">
                                        </div>
                                    </li>
                                    <li class="secli">
                                        <dl>
                                            <dt><a href="#" title="河南高中会考部分考题疑遭泄露 QQ群称开考15分钟发答案">
                                                河南高中会考部分考题疑遭泄露 QQ群称开考15分钟发答案</a>
                                            </dt>
                                            <dd>网易新闻　01-10 07:22</dd>
                                        </dl>
                                    </li>
                                    <li class="secli">
                                        <dl>
                                            <dt>
                                                <a href="#"
                                                   title="江西卫生计生委通报1例H5N6病例 患者已病亡">
                                                    江西卫生计生委通报1例H5N6病例 患者已病亡</a>
                                            </dt>
                                            <dd> 搜狐新闻　01-11 18:35</dd>
                                        </dl>
                                    </li>
                                </ul>
                            </div>
                            <div class="flogt">
                                <div>
                                    <a href="#" class="hot">事实热点</a>
                                        <span>
                                            <a href="javascript:;" class="change">
                                                <span></span>
                                                换一换
                                            </a>
                                         </span>
                                </div>
                                <ul class="newslt1">
                                    <li><a href="#"><em></em>男生捅前女友7刀 </a></li>
                                    <li><a href="#"><em></em>广西扑克牌通缉令</a></li>
                                    <li><a href="#"><em></em>巨浪袭击悉尼海岸</a></li>
                                    <li><a href="#"><em></em>男生被篮球架砸死</a></li>
                                    <li><a href="#"><em></em>老兵离世捐献遗体</a></li>
                                    <li><a href="#"><em></em>未婚女体检丢清白</a></li>
                                    <li><a href="#"><em></em>梁静管虎现场吻咚</a></li>
                                    <li><a href="#"><em></em>许晴晒甜美自拍</a></li>
                                </ul>
                                <ul class="newslt2">
                                    <li><a href="#"><em></em>北川景子宣布结婚 </a></li>
                                    <li><a href="#"><em></em>大卫鲍威去世</a></li>
                                    <li><a href="#"><em></em>孟非节目被指抄袭</a></li>
                                    <li><a href="#"><em></em>英男童捡漂流瓶</a></li>
                                    <li><a href="#"><em></em>亵渎周恩来被举报</a></li>
                                    <li><a href="#"><em></em>春运火车票退票潮</a></li>
                                    <li><a href="#"><em></em>曝范冰冰倒追李晨</a></li>
                                    <li><a href="#"><em></em>大学生讨打工工资</a></li>
                                </ul>
                            </div>
                        </div>
                    </li>
                    <li class="radiotext">
                        <div class="radioinner">
                            <ul class="radioul">
                                <li class="top-info">
                                    <a href="#">
                                        <img src="b/u58.jpg" title="金星脱口秀"/>
                                    </a>

                                    <div class="fontinfo">
                                        <a href="#" title="金星脱口秀" class="text">金星脱口秀</a>
                                        <div class="scole1">
                                            <span class="wstar"><span class="bstar"></span></span>6.5
                                        </div>
                                    </div>
                                </li>
                                <li class="top-info">
                                    <a href="#">
                                        <img src="b/u8.jpg" title="我们这波人"/>
                                    </a>

                                    <div class="fontinfo">
                                        <a href="#" title="我们这波人"
                                           class="text">我们这波人</a>

                                        <div class="scole1 scolebox">
                                            <span class="wstar"><span class="bstar"></span></span>6.4
                                        </div>
                                    </div>
                                </li>
                                <li>
                                    <div class="top-info">
                                        <a href="#">
                                            <img src="b/u=58.jpg" title="德国科隆性侵案嫌疑人基本都有移民背景"/>
                                        </a>

                                        <div class="fontinfo">
                                            <a href="#" title="德国科隆性侵案嫌疑人基本都有移民背景" class="text">
                                                德国科隆性侵案嫌疑人基本都有移民背景
                                            </a>
                                        </div>
                                    </div>
                                    <div class="top-info">
                                        <a href="#">
                                            <img src="b/u=358.jpg" title="旋转门内玩穿越 男童被卡获救"/>
                                        </a>

                                        <div class="fontinfo">
                                            <a href="#"
                                               title="旋转门内玩穿越 男童被卡获救" class="text">旋转门内玩穿越 男童被卡获救</a>
                                        </div>
                                    </div>
                                </li>
                                <li>
                                    <div class="top-info">
                                        <a href="#">
                                            <img src="b/&fm=58.jpg" title="宁夏：1.05公交纵火案 犯罪嫌疑人被逮捕"/>
                                        </a>

                                        <div class="fontinfo">
                                            <a href="#"
                                               title="宁夏：1.05公交纵火案 犯罪嫌疑人被逮捕" class="text">宁夏：1.05公交纵火案 犯罪嫌疑人被逮捕</a>
                                        </div>
                                    </div>
                                    <div class="top-info">
                                        <a href="#">
                                            <img src="b/58.jpg" title="哈士奇不舍主人出门 不停哀嚎令人心软"/>
                                        </a>

                                        <div class="fontinfo">
                                            <a href="#"
                                               title="哈士奇不舍主人出门 不停哀嚎令人心软" class="text">哈士奇不舍主人出门 不停哀嚎令人心软</a>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li class="shoppingtext">
                        <ul class="shopinner">
                            <li class="marbottom">
                                <a href="#">
                                    <img src="b/2cdd.jpg"/>
                                </a>

                                <div>
                                    <a href="#" title="豆捞坊100元代金券">豆捞坊100元代金券</a>
                                    <span>¥ 80</span>
                                </div>
                            </li>
                            <li class="marbottom">
                                <a href="#">
                                    <img src="b/ff55.jpg"/>
                                </a>

                                <div>
                                    <a href="#" title="山林熟30元代金券">山林熟30元代金券</a>
                                    <span>¥ 25.8</span>
                                </div>
                            </li>
                            <li class="marbottom">
                                <a href="#">
                                    <img src="b/9498.jpg"/>
                                </a>

                                <div>
                                    <a href="#" title="争鲜美味菜品任选四样">争鲜美味菜品任选四样</a>
                                    <span>¥ 20</span>
                                </div>
                            </li>
                            <li class="marbottom">
                                <a href="#">
                                    <img src="b/cd14.jpg"/>
                                </a>

                                <div>
                                    <a href="#" title="小辉哥100元代金券">小辉哥100元代金券</a>
                                    <span>¥ 90.5</span>
                                </div>
                            </li>
                            <li class="marbottom">
                                <a href="#">
                                    <img src="b/1493.jpg"/>
                                </a>

                                <div>
                                    <a href="#" title="食之秘100元代金券">食之秘100元代金券</a>
                                    <span>¥ 79</span>
                                </div>
                            </li>
                            <li class="marbottom">
                                <a href="#">
                                    <img src="b/653.jpg"/>
                                </a>

                                <div>
                                    <a href="#" title="七欣天88波格力蟹套餐">七欣天88波格力蟹套餐</a>
                                    <span>¥ 68</span>
                                </div>
                            </li>
                            <li class="marbottom">
                                <a href="#">
                                    <img src="b/cf3.jpg"/>
                                </a>

                                <div>
                                    <a href="#" title="望湘园100元代金券">望湘园100元代金券</a>
                                    <span>¥ 77.99</span>
                                </div>
                            </li>
                            <li class="marbottom">
                                <a href="#">
                                    <img src="b/e258.jpg"/>
                                </a>

                                <div>
                                    <a href="#" title="蜀江烤鱼85抵100券">蜀江烤鱼85抵100券</a>
                                    <span>¥ 76.5</span>
                                </div>
                            </li>
                        </ul>
                    </li>
                </ul>
                <div class="rect">
                    <div class="down"></div>
                </div>
            </div>
        </div>
        <div class="fix">
            <div class="return1 on"></div>
            <div class="return2">回到顶部</div>
        </div>
    </article>
    <!-- 底部 -->
    <footer>
        <div class="footerinner">
            <a href="#" class="index" target="_balnk">
                设为首页</a>
            <span>&copy;2016 Baidu</span>
            <a href="#">使用百度前必读</a>
            <a href="#">意见反馈</a>
            <span>京ICP证030173号</span>
            <span class="last"></span>
        </div>
    </footer>
</div>
<script src="./jquery-2.1.4.min.js"></script>
<script src="./baidufinish.js"></script>
</body>
</html>




